import React, { PureComponent } from 'react';
import { Card, Modal, Button, message } from 'antd';
import FileView from '@/components/FileView';

class FileModal extends PureComponent<any, any> {
  constructor(props: any) {
    super(props);
    this.state = {
      formValues: {}
    };
  }

  componentDidMount() {
    this.props.onRef(this);
  }

  componentDidUpdate(prevProps: any) {
    const { modalVisible, file, dispatch } = this.props;
    if (modalVisible && modalVisible !== prevProps.modalVisible) {
      this.fileViewRef?.setData({
        ...file
      })
    }
  }

  //  关闭操作
  cancel = () => {
    const { closeModal } = this.props;
    closeModal();
    this.fileViewRef?.clearData();
  };

  render() {
    const { modalVisible, file } = this.props;
    const footer = (
      <div>
        <Button size="small" onClick={this.cancel}>
          关闭
        </Button>
      </div>
    );
    const { width = '100%', height = '750px'} = this.props;
    return (
      <>
        <Modal
          style={{ top: 20 }}
          footer={null}
          width={width}
          title="案例文件"
          bodyStyle={{
            height: height,
            maxHeight: height
          }}
          visible={modalVisible}
          onCancel={this.cancel}
        >
          <FileView onRef={(modalRef: any) => (this.fileViewRef = modalRef)} />
        </Modal>
      </>
    )
  }
}
export default FileModal;
